<template>
	<view>
		<block v-if="item.type==1">
			<div class="fz28 mb-10" v-if="item.start_time">充电开始时间：{{item.start_time}}</div>
			<div class="fz28 mb-10" v-if="item.end_time">充电结束时间：{{item.end_time}}</div>
			<div class="between mb-10">
				<div class="fz28" v-if="item.status==4">充电时长：{{item.charging_duration}}分</div>
				<div class="fz28" v-if="item.status==5||item.status==6">充电时长：{{item.charging_duration}}分</div>
				<div class="fz28">平均时段 <text style="color: #FF0000;">{{item.du}}</text> 元/度</div>
			</div>
			<div class="between mb-10 fz28">
				<div v-if="item.car">充电车辆：{{item.car.name}}</div>
				<div>充电量：{{item.charging_capacity}}度</div>
			</div>
			<div class="between mb-10 fz28">
				<div>电费：{{item.electric_price}}元</div>
				<div>服务费：{{item.service_price}}元</div>
			</div>
			<div class="between mb-10 fz28" v-if="item.status==4">
				<div v-if="item.status==4">停车费：{{item.park_price_wait}}元</div>
				<div v-if="item.status==5||item.status==6">停车费：{{item.park_price}}元</div>
				<div>总计：{{(Number(item.park_price_wait)+Number(item.charge_price)).toFixed(2)}}元</div>
				<!-- <div>剩余免费停车时长：15分钟</div> -->
			</div>
			<div class="between mb-10 fz28" v-if="item.status==5||item.status==6">
				<div v-if="item.status==4">停车费：{{item.park_price_wait}}元</div>
				<div v-if="item.status==5||item.status==6">停车费：{{item.park_price}}元</div>
				<div>总计：{{(Number(item.park_price)+Number(item.charge_price)).toFixed(2)}}元</div>
				<!-- <div>剩余免费停车时长：15分钟</div> -->
			</div>
		</block>
		
		<block v-if="item.type==2">
			<div class="fz28 mb-10" v-if="item.start_time">停车开始时间：{{item.start_time}}</div>
			<div class="fz28 mb-10" v-if="item.end_time">停车结束时间：{{item.end_time}}</div>
			<div class="between mb-10">
				<div class="fz28" v-if="item.status==4">停车时长：{{item.use_time}} 分钟</div>
				<div class="fz28" v-if="item.status==5||item.status==6">停车时长：{{item.use_time2}} 分钟</div>
			</div>
			<div class="between mb-10 fz28">
				<div v-if="item.car">停车车辆：{{item.car.name}}</div>
				<div v-if="item.car">车牌号：{{item.car.car_number}}</div>
			</div>
			<div class="between mb-10 fz28" v-if="item.status==4">
				<div>停车费：{{item.park_price_wait}}元</div>
				<!-- <div>剩余免费停车时长：15分钟</div> -->
			</div>
			<div class="between mb-10 fz28" v-if="item.status==5||item.status==6">
				<div>停车费：{{item.park_price}}元</div>
				<!-- <div>剩余免费停车时长：15分钟</div> -->
			</div>
		</block>
	</view>
</template>

<script>
	export default {
		props: ["val","menu_type"],
		data() {
			return {
				item:{},
				intervalId: null
			}
		},
		mounted() {
			this.item = this.val
			this.lookat();
		},
		beforeDestroy() { // 对于 Vue 2 组件
			this.clearTimer();
		},
		methods: {
			lookat(){
				var that = this
				var id = this.val.id
				if(that.menu_type==3){
					that.order(id)
					this.intervalId = setInterval(function(){
						that.order(id)
					},5000)
				}
			},
			clearTimer() {
			  if (this.intervalId) {
				clearInterval(this.intervalId);
				this.intervalId = null; // 清除引用，帮助垃圾回收
			  }
			},
			async order(id){
				var that = this
				const res = await this.http("post", "/api/order/info3", {
					id: id,
				})
				this.item = res.data
			},
		}
	}
</script>

<style>
</style>